<template>
  <div class="test" v-for="i in arr" :key="i">
    <!-- for循环内可以复用插槽，插槽内可以定义默认值 -->
    <slot :item="i">
      <h3>{{ i }}</h3>
    </slot>
  </div>
</template>
<script>
import { ref } from 'vue'
export default {
  name: 'SlotTest',
  setup () {
    const arr = ref(['js', 'java', 'c++'])
    return { arr }
  }
}
</script>
<style lang="less" scoped>
.test {
  font-size: 20px;
  width: 500px;
  margin: 0 auto;
}
</style>
